require('./Girdview.styl');
import urllist from 'clientConfig/urllist';
import net from 'clientConfig/util/net';
import { Control } from 'react-keeper';
import { Grid } from 'saltui'
const monStorage = require('clientConfig/util/StoreData').monStorage;
const Storage = require('clientConfig/util/StoreData').Storage;
/**
 * title:格子的标题
 * path:url跳转
 * imgsrc:图片的路径
 */
const Girdview = ({ girdItems, path }) => {
    if (!girdItems) return;
    let variableString = [];
    for (let key in girdItems) {
        variableString.push(require('images/svg/home_gird/' + girdItems[key].imgsrc + '.svg'));
    }
    //九宫格页面跳转
    let handleLink = (options, title) => {
        //url的#跳转
        Control.go(options)
    }
    return (
        <div className="girdview">
            <Grid className="ft14 t-PL15 t-PR15" col={4} square={true} touchable={false} noLine={true}>
                {girdItems && girdItems.map((item, index) => {
                    const Scomponents = variableString[index];
                    return (<div className="t-FAC" onClick={() => { handleLink(item.hashPath, item.title) }} data-id={index}>
                        <div style={{ position: 'relative' }}>
                            <Scomponents width="30"/>
                        </div>
                        <div className=" t-SMT12 gird-item">{girdItems[index].title}</div>
                    </div>);
                })}
            </Grid>
        </div>);
}
module.exports = Girdview;
